<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>汇报详情</title>
    <link rel="stylesheet" type="text/css" href="../../css/mui.min.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/style.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/t_style.css"/>
    <script src="../../js/mui.min.js"></script>
    <script src="../../js/jquery.min.js"></script>
    <script src="../../js/vue.js"></script>
    <script src="../../js/main.js"></script>
    <script src="../../js/jquery.flexText.min.js"></script>
    <style>
        [v-cloak] {
            display: none;
        }
    </style>
</head>
<body>
<div id="app" v-cloak>
    <header class="mui-bar mui-bar-nav">
        <span class="back" @click="back"></span>
        <h1 class="mui-title" v-text="re_title">汇报详情</h1>
        <span class="edit-name fr" v-show="self" v-text="edit" @click="toggle"></span>
    </header>
    <div class="mui-content" style="padding-bottom: 70px" v-show="finish">
        <div class="my_report">
            <div class="report-top">
                <div class="report-headimg fl" v-text="item.headName"></div>
                <div class="report-info">
                    <p>{{item.userName}}<span class="report-type-item daily" v-text="item.type"></span></p>
                    <p v-text="item.time"></p>
                </div>
            </div>
            <div class="module-area" style="margin-top: 0;border-top: 1px solid #e0e0e0;padding: 0">
                <div class="module" v-for="(item, index) in item.list">
                    <p v-text="item.title"></p>
                    <div class="write-area">
                        <textarea placeholder="暂无" v-model="item.content" :readonly="isReadOnly"></textarea>
                    </div>
                </div>
            </div>
            <p v-show="time_show" style="color: #8f8f94;margin-bottom: 0;border-top: 1px solid #e0e0e0;padding-top: 10px">重新修改时间<span style="margin-left: 10px" v-text="re_time"></span></p>
        </div>
        <!--<div class="add-sender add-area">
            <p>接收群</p>
            <span class="report-group" v-for="(item,index) in group" v-text="item.name" style="margin-right: 10px"></span>
        </div>-->
        <div class="discuss-area">
            <p class="discuss-title">评论<span style="color: #8f8f94;margin-left: 5px" v-show="dis_show">(暂无)</span></p>
            <ul class="discuss-list">
                <li class="report-top" v-for="(dis,index) in common">
                    <div class="report-headimg fl" v-text="dis.headName"></div>
                    <div class="report-info discuss-text">
                        <p>{{dis.userName}}<span class="fr" v-text="dis.time"></span></p>
                        <div class="discuss-info" v-text="dis.text"></div>
                    </div>
                    <div class="clear"></div>
                </li>
            </ul>
        </div>
        <div class="return-footer">
            <div class="return-btn fr" @click="send"></div>
            <div class="return-input">
                <input type="text" placeholder="输入文字..." v-model="discuss"/>
            </div>
        </div>
    </div>
</div>
</body>
<script>
    function sendInfoToJava(name) {
        //调用android程序中的方法，并传递参数
        javascript:WebView.showInfoFromJs(name);
    }
    var app = new Vue({
        el: "#app",
        data: function () {
            return{
                item: {},
                self: true,
                edit: "修改",
                discuss: "",
                common: [],
                indexCount: 0,
                type: 1,
                isReadOnly: true,
                group: [],
                finish: false,
                dis_show: true,
                time_show: false,
                re_time: "",
                re_title: ""
            }
        },
        methods: {
            back: function () {
                var name = "back";
                sendInfoToJava(name);
            },
            ready: function () {
                var this_obj = this;
                var read_url = "/report/zgReportReadUser";
                var read_data = {
                    "loginName": localStorage.userName,
                    "reportId": localStorage.zgReportId
                };
                if(typeof(localStorage.companyId) == "undefined" || typeof(localStorage.userName) == "undefined" || typeof(localStorage.fullName) == "undefined"){
                    mui.toast("请重新登录");
                }else {
                    common_ajax(read_url,read_data,function (res) {
                        console.log(res);
                    },function (res) {
                        console.log(res);
                    });
                    var url = "/report/zgReports";
                    var data = {
                        "pageNo": 1, //第几页必传
                        "pageSize": 1,  //页有几个数据必传
                        "companyId": localStorage.companyId, //公司ID必传
                        "contentDetails": true,//是否看详情
                        "zgReportId": localStorage.zgReportId,
                        "loginingName": localStorage.userName
                    };
                    common_ajax(url,data,function (res) {
                        if(res.code < 0){
                            mui.toast(res.errorMsg);
                        }else {
                            /*this_obj.group = [];
                             var groups = JSON.stringify(JSON.parse(res.obj[0].sendGroupJson));
                             for(var i in groups){
                             this_obj.group.push({id: res.obj[0].sendGroupJson[i]['groupId'],name: res.obj[0].sendGroupJson[i]['groupName']});
                             }*/
                            this_obj.indexCount = res.obj[0]['indexCount'];
                            this_obj.type = res.obj[0]['type'];
                            if(localStorage.userName == res.obj[0]['createUser']){
                                this_obj.self = true;
                            }else{
                                this_obj.self = false;
                            }
                            var list = [];
                            for(var i in res.obj[0].textList){
                                list.push({title: res.obj[0].textList[i]['title'],content: res.obj[0].textList[i]['content']});
                            }
                            var headName = res.obj[0]['createUserName'].slice(-2);
                            if(!res.obj[0]['updateTime']){
                                this_obj.time_show = false;
                            }else{
                                this_obj.time_show = true;
                                this_obj.re_time = res.obj[0]['updateTime'].substr(0,16);
                            }
                            var time = res.obj[0]['createTime'].substr(0,16);
                            var r_type;
                            if(res.obj[0]['type'] == 1){
                                r_type = "日报";
                            }else if(res.obj[0]['type'] == 2){
                                r_type = "周报";
                            }else if(res.obj[0]['type'] == 3){
                                r_type = "月报";
                            }
                            this_obj.re_title = res.obj[0]['createUserName'] + "的" + r_type;
                            this_obj.item = {id: res.obj[0]['zgReportId'],type: r_type,time: time,userName: res.obj[0]['createUserName'],headName: headName,list: list};
                            this_obj.common = [];
                            if(res.obj[0].commList.length == 0 || res.obj[0].commList == null){
                                this_obj.dis_show = true;
                            }else{
                                this_obj.dis_show = false;
                                for(var i in res.obj[0].commList){
                                    var hName = res.obj[0].commList[i]['userName'].slice(-2);
                                    var dis_time = res.obj[0].commList[i]['createTime'].substr(0,16);
                                    this_obj.common.push({id: res.obj[0].commList[i]['zgReportCommentId'],headName: hName,userName: res.obj[0].commList[i]['userName'],time: dis_time,text: res.obj[0].commList[i]['content']});
                                }
                            }
                            this_obj.finish = true;
                            this_obj.$nextTick(function(){
                                $('textarea').flexText();
                            })
                        }
                    },function (res) {
                        console.log(res);
                    })
                }
            },
            toggle: function () {
                var this_obj = this;
                if(this_obj.edit == "修改"){
                    this_obj.edit = "完成";
                    this_obj.isReadOnly = false;
                }else{
                    if(this_obj.item.list[0]['content'] == ""){
                        mui.toast("请输入"+this_obj.item.list[0]['title']);
                    }else if(this_obj.item.list[1]['content'] == ""){
                        mui.toast("请输入"+this_obj.item.list[1]['title']);
                    }else if(this_obj.item.list[2]['content'] == ""){
                        mui.toast("请输入"+this_obj.item.list[2]['title']);
                    }else if(this_obj.item.list[3]['content'] == ""){
                        mui.toast("请输入"+this_obj.item.list[3]['title']);
                    }else{
                        this_obj.edit = "修改";
                        this_obj.isReadOnly = true;
                        var url = "/report/updateReport";
                        var data = {
                            "indexCount": this_obj.indexCount,
                            "textList": [
                                {
                                    "content": this_obj.item.list[0]['content'],
                                    "title": this_obj.item.list[0]['title']
                                },{
                                    "content": this_obj.item.list[1]['content'],
                                    "title": this_obj.item.list[1]['title']
                                },{
                                    "content": this_obj.item.list[2]['content'],
                                    "title": this_obj.item.list[2]['title']
                                },{
                                    "content": this_obj.item.list[3]['content'],
                                    "title": this_obj.item.list[3]['title']
                                },{
                                    "content": this_obj.item.list[4]['content'],
                                    "title": this_obj.item.list[4]['title']
                                }
                            ],
                            "type": this_obj.type, //1日报 2周报 3月报
                            "zgReportId": localStorage.zgReportId,
                            "createUser": localStorage.userName,
                            "name": localStorage.fullName
                        };
                        common_ajax(url,data,function (res) {
                            if(res.code < 0){
                                mui.toast(res.errorMsg);
                            }else {
                                var name = "alreadyChange";
                                sendInfoToJava(name);
                            }
                        },function (res) {
                            mui.toast("修改失败");
                        });
                    }
                }
            },
            send: function () {
                var this_obj = this;
                if(this_obj.discuss == ""){
                    mui.toast("请输入评论内容");
                }else if(!localStorage.userName){
                    mui.toast("网络异常");
                }else{
                    var url = "/report/zgReportComment";
                    var data = {
                        "content": this_obj.discuss,
                        "loginName": localStorage.userName,
                        "reportId": localStorage.zgReportId
                    };
                    if(typeof(localStorage.companyId) == "undefined" || typeof(localStorage.userName) == "undefined" || typeof(localStorage.fullName) == "undefined"){
                        mui.toast("请重新登录");
                    }else {
                        common_ajax(url,data,function (res) {
                            if(res.code < 0){
                                mui.toast(res.errorMsg);
                            }else{
                                this_obj.ready();
                                this_obj.discuss = "";
                            }
                        },function (res) {
                            console.log(res);
                        });
                    }
                }
            }
        }
    });
    app.ready();
</script>
</html>